<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="/css/pintuer.css">
    <link rel="stylesheet" href="/css/admin.css">

    <script type="text/javascript" src="/js/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="/js/bootstrap.js"></script>
    <script type="text/javascript" src="/js/jquery.serializejson.js"></script>
    <script type="text/javascript" src="/js/vue.js"></script>
    <script type="text/javascript" src="/js/designercomponents.js"></script>

</head>
<body>
<div class="panel admin-panel" id="app">
    <div class="panel-head">
        <strong class="icon-reorder"> 项目户型图表</strong>
    </div>
    <div class="padding border-bottom">
        <form id="Formid">
            <button type="button" class="button border-green" id="checkall" @click="checkall">
                <span class="icon-check"></span> 全选
            </button>
            <button type="button" class="button border-blue">
                <span class="icon-check"></span> <a href="adddesigner.html">新增户型图表</a>
            </button>
            <input type="hidden" name="opr" value="delall"/>
            <button type="button" class="button border-red" id="goodsupdate" @click="deleteAll">
                <span class="icon-trash-o"></span> 批量删除
            </button>
        </form>
    </div>

    <div class="padding border-bottom">
        <form id="queryForm">
            <ul class="search" style="padding-left: 0px;">

                <li><input type="text" class="input" id="floorProjectId" v-model="example.floorProjectId"
                           placeholder="请输入项目id"
                           style="width: 200px; line-height: 17px;">
                </li>

                <li><select class="input" id="floorStatus" v-model="example.floorStatus"
                            style="width: 200px; line-height: 17px;">
                    <option :value=0>全部</option>
                    <option :value=1>已审核</option>
                    <option :value=2>未审核</option>
                    <option :value=3>待修改</option>
                </select></li>

            </ul>
        </form>
    </div>
    <page :url="url" :example="example" :columns="columns"></page>
</div>
</body>
<script type="text/javascript">
    var _this = this;
    var b = false;
    var nums = [];
    var app = new Vue({

        el: "#app",
        data: {
            example: {
                floorProjectId: '',
                floorPlan: '',
                floorStatus: 0,
                pageIndex: 1,
                num: 5
            },
            url: "/designer/query",
            columns: [

                {text: "序号", id: "floorPlanId"},
                {text: "项目id", property: "floorProjectId"},
                {text: "状态", property: "floorStatus"},
                {text: "图片", property: "floorPlan"},
            ]//定义分页组件内部表格中的列信息
        },

        methods: {
            checkall: function () {
                $(":checkbox[name=checkbox]").prop("checked", b = !b);
            },
            deleteAll: function () {
                if (confirm("确认删除吗？")) {
                    $(".checkbox").each(function (id) {
                        if ($(this).prop("checked")) {
                            nums[nums.length] = $(this).parent().next().text();
                        }
                    });
                    if (nums.length != 0) {
                        $.ajax({
                            url: "/designer/deleteAll",
                            type: "post",
                            data: {nums: nums},
                            ContentType: "application/json;charset=UTF-8",
                            success: function (data) {
                                $(":checkbox[name=checkbox]").prop("checked", false);
                                _that.selectByExample();
                            }

                        })
                    }
                }
            }
        }
    })

</script>
</html>